<template>
  <list>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="require">*</text>
          <text class="key-text">甲方(购买户):</text>
        </div>
        <text class="value">{{xyjf}}</text>
        <!-- <input class="value inputValue" @focus='change' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="require">*</text>
          <text class="key-text">甲方联系方式:</text>
        </div>
        <text class="value">{{jflxdh}}</text>
        <!-- <input class="value inputValue" @focus='changejflxdh' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="require">*</text>
          <text class="key-text">乙方(中标单位):</text>
        </div>
        <text class="key-text">{{xyyfmc}}</text>
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="require">*</text>
          <text class="key-text">乙方联系方式:</text>
        </div> 
        <text class="value">{{yflxdh}}</text>
        <!-- <input class="value inputValue" @focus='changeyflxdh' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="key-text">客户编号:</text>
        </div>
        <text class="value">{{khbh}}</text>
        <!-- <input class="value inputValue" @focus='changekhbh' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="key-text">电表号:</text>
        </div>
        <text class="value">{{dbh}}</text>
        <!-- <input class="value inputValue" @focus='changedbh' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="key-text">协议丙方(村委会):</text>
        </div>
        <text class="value">{{xybf}}</text>
        <!-- <input class="value inputValue" @focus='changexybf' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="key-text">丙方联系方式:</text>
        </div>
        <text class="value">{{bflxfs}}</text>
        <!-- <input class="value inputValue" @focus='changebflxfs' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="key-text">协议ID:</text>
        </div>
        <text class="value">{{xyid}}</text>
        <!-- <input class="value inputValue" @focus='changexybh' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="require">*</text>
          <text class="key-text">所属行政区划:</text>
        </div>
        <text class="value notice">{{ssxzqh}}</text>
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="require">*</text>
          <text class="key-text">工程地址:</text>
        </div>
        <text class="value">{{gcdz}}</text>
        <!-- <input class="value inputValue" @focus='changegcdz' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="key-text">采暖方式:</text>
        </div>
        <text class="value">{{cnfs}}</text>
        <!-- <input class="value inputValue" @focus='changecnfs' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="require">*</text>
          <text class="key-text">采暖末端方式:</text>
        </div>
        <text class="value notice">{{mdcnfs}}</text>
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="key-text">暖气片数:</text>
        </div>
        <text class="value">{{nqps}}</text>
        <!-- <input class="value inputValue" @focus='changenqps' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key"> 
          <text class="key-text">产品型号:</text>
        </div>
        <text class="value notice">{{cpxh}}</text>
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="key-text">单三项设备:</text>
        </div>
        <text class="value">{{dsxd}}</text>
        <!-- <input class="value inputValue" @focus='changedsxd' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="require">*</text>
          <text class="key-text">供暖面积/平米:</text>
        </div>
        <text class="value">{{gnmj}}</text>
        <!-- <input class="value inputValue" @focus='changegnmj' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="key-text">产品单价/元:</text>
        </div>
        <text class="value">{{cpdj}}</text>
        <!-- <input class="value inputValue" @focus='changecpdj' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="key-text">产品数量:</text>
        </div>
        <text class="value">{{cpsl}}</text>
        <!-- <input class="value inputValue" @focus='changecpsl' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="key-text">产品总价/元:</text>
        </div>
        <text class="value">{{cpzj}}</text>
        <!-- <input class="value inputValue" @focus='changecpzj' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="key-text">总费用/元:</text>
        </div>
        <text class="value">{{zfy}}</text>
        <!-- <input class="value inputValue" @focus='changezfy' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="key-text">政府补贴费用/元:</text>
        </div>
        <text class="value">{{zfbtfy}}</text>
        <!-- <input class="value inputValue" @focus='changezfbtfy' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="key-text">农户自筹费用:</text>
        </div>
        <text class="value">{{nhzcfy}}</text>
        <!-- <input class="value inputValue" @focus='changenhzcfy' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="key-text">免费质保时间:</text>
        </div>
        <text class="value">{{bxq}}</text>
        <!-- <input class="value inputValue" @focus='changebxq' /> -->
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="require">*</text>
          <text class="key-text">协议签订时间:</text>
        </div>
        <text class="value notice">{{xyqdsj}}</text>
      </div>
    </cell>
    <cell>
      <div class="cell">
        <div class="key">
          <text class="key-text">建筑面积/平米:</text>
        </div>
        <text class="value">{{jzmj}}</text>
        <!-- <input class="value inputValue" @focus='changejzmj' /> -->
      </div>
    </cell>
    <cell>
      <div class="bzCell">
        <div class="bzKey">
          <text class="key-text">备注:</text>
        </div>
        <text class="textArea">{{bz}}</text>
        <!-- <textarea class="textArea bzArea" cols="7" rows="7" @click='changebz'></textarea> -->
      </div>
    </cell>
    <cell>
        <div class="listItems">
            <button class="btnbar" @click="queryA"><text class="btnText">修改</text></button>
        </div>
    </cell>
  </list>
</template>
<script>
  import { addIconFontSupport } from '@/config/iconConfig'
  const dom = weex.requireModule('dom')
  
  export default {
    name: 'addItem',
    data () {
        return {
            datalist: [],
            xyjf: '',
            jflxdh: '',
            khbh: '',
            dbh: '',
            xyyf: '',
            xyyfmc: '',
            yflxdh: '',
            xybf: '',
            gcdz: '',
            cnfs: '',
            mdcnfs: '',
            nqps: '',
            cpxh: '',
            dsxd: '',
            gnmj: '',
            cpdj: '',
            cpsl: '',
            cpzj: '',
            zfy: '',
            zfbtfy: '',
            nhzcfy: '',
            bxq: '',
            xyqdsj: '',
            bz: '',
            ssxzqh: '',
            sblxid: '',
            jzmj: '',
            bflxfs: '',
            xyid: ''
        }
    },
    beforeCreate () {
      addIconFontSupport(dom, "../../")
      this.$notice.loading.show()
      this.$navigator.setRightItem({
        text: '   ＋',
        fontSize: '40',
        fontWeight: 'normal'
        }, () => {
            this.$router.open({
                name: 'addItem',
                params: {
                    ind: 1
                }
            })
        })
    },
    mounted() {
      this.$notice.loading.hide()
    },
    created(){
        this.$router.getParams().then(resData => {
            this.datalist = resData.datalist
            this.nqps = resData.datalist.NQPS
            this.bflxfs = resData.datalist.BFLYFS
            this.dsxd = resData.datalist.DSXSB
            this.zfbtfy = resData.datalist.ZFBTFY
            this.bz = resData.datalist.BZ
            this.khbh = resData.datalist.KHBH
            this.cpsl = resData.datalist.CPSL
            this.gnmj = resData.datalist.GNMJ
            this.xyjf = resData.datalist.XYJF
            this.xyyfmc = resData.datalist.XYYF
            this.ssxzqh = resData.datalist.SSXZQH
            this.jflxdh = resData.datalist.JFLXFS
            this.jzmj = resData.datalist.JZMJ
            this.xybf = resData.datalist.XYBF
            this.cpxh = resData.datalist.CPXH
            this.yflxdh = resData.datalist.YFLXFS
            this.zfy = resData.datalist.ZFY
            this.cpzj = resData.datalist.CPZJ
            this.dbh = resData.datalist.DBH
            this.xyid = resData.datalist.XY_ID
            this.bxq = resData.datalist.MFZBSJ
            this.gcdz = resData.datalist.GCDZ
            this.mdcnfs = resData.datalist.MDCAFS
            this.xyqdsj = resData.datalist.XYQDSJ
            this.nhzcfy = resData.datalist.NHZCFY
            this.cnfs = resData.datalist.CNFS
        })
    },
    methods: {
        queryA () {
          this.$router.open({
              name: 'installDetail',
              params: {
                datalist: this.datalist
              }
          })
      }
    }
  }
</script>
<style lang="scss" scoped>
  @import "../../../config/styles";

  .cell {
    width: 750px;
    height: 100px;
    background-color: white;
    @include border(2px, solid, #f5f5f5, bottom);
    padding: 0 20px;
    flex-direction: row;
    align-items: center;
  }
  .outline {
    margin-top: 20px;
  }
  .add-icon {
    font-family: wxcIconFont;
    color: #3EAFFC;
  }
  .space-between {
    justify-content: space-between;
  }
  .icon-btn {
    height: 100px;
    width: 80px;
    align-items: center;
    justify-content: flex-end;
    flex-direction: row;
  }
  .text {
    color: #666;
  }
  .delete-icon {
    font-family: wxcIconFont;
    color: #ccc;
    font-size: 42px;
    margin-right: -5px;
  }
  .left {
    justify-content: space-around;
    height: 70px;
  }
  .equip-item {
    flex-direction: row;
    padding-left: 30px;
  }
  .line {
    width: 8px;
    height: 28px;
    background-color: rgba(62,175,252,1);
    margin-left: -25px;
    margin-right: 15px;
  }
  .equip-key{
    color:#666;
    font-family:PingFangSC-Regular;
    font-size: 25px;
    width: 160px;
  }
  .equip-value{
    font-family:PingFangSC-Regular;
    color:rgba(151,151,151,1);
    font-size: 25px;
  }
  .text{
      font-size: 28px;
      color: #666;
  }
  .value {
    flex: 1;
    height: 80px;
    font-size: 28px;
    color: #666;
    line-height: 80px;
  }
  .inputValue{
    position: relative;
    flex: 1;
    left: -236px;
    display: block;
    height: 80px;
    line-height: 80px;
  }
  .key {
    width: 235px;
    flex-direction: row;
  }
  .key-text {
    color: #666;
  }
  .notice {
    color: #3EAFFC;
  }
  .deletInput {
    height: 1px;
    margin-top: -1px;
  }
  .require {
    color: red;
    font-size: 22px;
    padding-right: 4px;
  }
  .image-line {
    width: 8px;
    height: 28px;
    background-color: rgba(62,175,252,1);
    margin: 15px;
  }
  .image-wrapper {
    padding: 20px;
    flex-direction: row;
  }
  .listItems{
    width: 750px;
    height: 100px;
    justify-content: center;
    align-items: center;
    margin-top: 44px;
    margin-bottom: 44px;
}
.bzCell{
    width: 750px;
    height: 264px;
    background-color: #fff;
    flex-direction: row;
    padding: 0 20px;
    padding-top: 25px;
}
.bzKey{
    width: 235px;
    flex-direction: row;
}
.btnbar{
    width: 285px;
    height: 60px;
    border-radius: 10px;
    background-color: rgba(62,175,252,1);
    justify-content: center;
    align-items: center;
}
.btnText{
    color: #fff;
    font-size: 28px;
    font-family:PingFangSC-Regular;
}
.textArea{
    width: 470px;
    height: 220px;
    font-size: 26px;
    font-family:PingFangSC-Regular;
    color:rgba(151,151,151,1);
}
.bzArea{
    position: relative;
    left: -470px;
}
.input{
    width: 25px;
    height: 25px;
    border-radius: 25%;
    border-color: rgba(151,151,151,1);
    border-style: solid;
    border-width: 1px;
    margin-right: 20px;
}
.contItem{
    width: 650px;
    height: 90px;
    border-bottom-color: #f5f5f5;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    padding-left: 20px;
  }
  .listItem{
    font-size:29.1px;
    font-family:PingFangSC-Regular;
    color:rgba(102,102,102,1);
}
.activeInput{
    width: 25px;
    height: 25px;
    border-color: rgba(62,175,252,1);
    border-width: 7px;
    border-style: solid;
}
.active{
    color: rgba(62,175,252,1);
}
.mark{
    display: block;
    width: 500px;
    height: 400px;
    line-height: 400px;
    text-align: center;
}
.choice{
    width: 700px;
    height: 100px;
    background-color: rgba(238,238,238,1);
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding-right: 15px;
    padding-left: 15px;
}
.choiceItem{
    display: block;
    width: 550px;
    height: 100px;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    
}
.textParent{
    flex-direction: row;
}
.placeName{
    /* padding-right: 15px; */
    font-size: 29.1px;
    font-family:PingFangSC-Regular;
    color:rgba(62,175,252,1);
    border-bottom-color: rgba(62,175,252,1);
    border-bottom-style: solid;
    border-bottom-width: 1px;
}
.standardDirection{
    color: #999;
    padding-left: 10px;
    padding-right: 10px;
}
.standardDirection:first-child{
    border: none;
}
.sure{
    width: 100px;
    height: 50px;
    background-color:rgba(62,175,252,1);
    border-radius:8px;
    justify-content: center;
    align-items: center;
}
.sureItem{
    font-size: 25px;
    font-family:PingFangSC-Regular;
    color:rgba(255,255,255,1);
}
</style>
